﻿@{
    Layout = "~/Views/Shared/_Layout.cshtml";
}
@section styles{
    <link rel="stylesheet" href="/css/other/person.css" />
    <style>
    </style>
}
<div class="layui-row layui-col-space10">
    <div class="layui-col-md3">
        <div class="layui-card">
            <div class="layui-card-body" style="padding: 26px;">
                <div class="text-center layui-text">
                    <div class="user-info-head" id="userInfoHead">
                        <img src="@Url.Action("GetProfilePicture","User")" id="userAvatar" width="115" height="115" alt="">
                    </div>
                    <h2 style="padding-top: 63px;font-size: 20px;">@ViewBag.UserName</h2>
                    <p style="padding-top: 8px;margin-top: 10px;font-size: 13.5px;">
                        @ViewBag.RoleNames
                    </p>
                </div>
            </div>
            <div style="height: 45px;border-top: 1px whitesmoke solid;text-align: center;line-height: 45px;font-size: 13.5px;">
                <span>用户类型:@ViewBag.UserType</span>
            </div>
        </div>

       
    </div>
    <div class="layui-col-md9">
       
        <div class="layui-card">
            <div class="layui-card-header">
                基本信息
            </div>
            <div class="layui-card-body">
                <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
                    <div class="layui-tab-content">
                        <div class="layui-tab-item layui-show">
                            <form class="layui-form" lay-filter="user-form">
                                <input type="hidden" name="Id" value="@Model.Id" />
                                <div class="layui-form-item">
                                    <label class="layui-form-label layui-form-required">用户姓名</label>
                                    <div class="layui-input-block">
                                        <input type="text" name="RealName" lay-verify="required" placeholder="请输入用户姓名" autocomplete="off" class="layui-input" value="@Model.RealName">
                                    </div>
                                </div>
                                <div class="layui-form-item">
                                    <label class="layui-form-label layui-form-required">手机号</label>
                                    <div class="layui-input-block">
                                        <input type="text" name="Mobile" lay-verify="required|Phone" placeholder="请输入手机号" autocomplete="off" class="layui-input" maxlength="11" value="@Model.Mobile">
                                    </div>
                                </div>
                                <div class="layui-form-item">
                                    <label class="layui-form-label layui-form-required">邮箱</label>
                                    <div class="layui-input-block">
                                        <input type="text" name="Email" lay-verify="Email" placeholder="请输入邮箱" autocomplete="off" class="layui-input" value="@Model.Email">
                                    </div>
                                </div>
                                <div class="layui-form-item">
                                    <div class="layui-input-block">
                                        <button class="pear-btn pear-btn-primary pear-btn-md" lay-submit lay-filter="user-submit" id="user-submit">提交</button>
                                    </div>
                                </div>

                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>

@*<div class="layui-row layui-col-space10 layui-hide">
    <div class="layui-col-md12">
        <div class="layui-card" style="padding: 26px;">
            <div class="layui-card-header">
                最新20条消息
            </div>
            <div class="layui-card-body divscrollbar" style="height: 400px; max-height: 400px; overflow:auto; ">
                <ul class="list">
                   @if (ViewBag.UserMessageList != null)
                    {
                        foreach (var item in ViewBag.UserMessageList)
                        {
                            <li class="list-item"><span class="title">@item.Content</span><span class="footer">@item.CreateDate</span></li>
                        }
                    }
                </ul>
            </div>
        </div>
    </div>
</div>*@
    @section scripts{
        <script type="text/javascript">
            layui.use(['lscom', 'form', 'convert'], function () {
                var $ = layui.$;
                var lscom = layui.lscom;
                var form = layui.form;
                var convert = layui.convert;

                @*var image = new Image();
                image.src = "@ViewBag.UserPhoto";
                image.onload = function () {
                    $("#userAvatar").attr("src", convert.imageToBase64(image));
                }*@
                //自定义验证规则
                form.verify({
                    Phone: function (value) {
                        if (!/^1\d{10}$/.test(value)) {
                            return '请输入正确的手机号';
                        }
                    },
                    Email: function (value) {
                        if (value!="" && !/^([a-zA-Z0-9_\.\-])+\@@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/.test(value)) {
                            return '请输入正确邮箱格式';
                        }
                    }
                });
                form.on('submit(user-submit)', function (data) {

                    var field = data.field;

                    var waitIndex = parent.layer.load(2);
                    lscom.ajax({
                        url: "/Systems/User/SaveMyUser",
                        data: JSON.stringify(field),
                        lsHandleError: false
                    }).done(function (data) {
                        if (data.code == 0) {
                            lscom.notify.success(data.message);
                        }
                    }).fail(function (message) {
                        lscom.notify.error(message);
                    }).always(function () {
                        parent.layer.close(waitIndex);
                    });

                    return false;
                });

              window.saveCallback = function (data) {
                  parent.layer.close(data.index);
                  lscom.notify.success(data.message);
                  $("#userAvatar").attr("src", "@Url.Action("GetProfilePicture", "User")");
                  parent.layui.$(".layui-nav-img").attr("src", "@Url.Action("GetProfilePicture", "User")");
                }

             $("#userAvatar").click(function () {
                parent.layer.open({
                    type: 2,
                    title: "更换图片",
                    content: "/Systems/User/UploadPicture",
                    area: ["900px","622px"],
                    shade: 0.1,
                    btn: ['确定', '取消'],
                    yes: function (index, layero) {
                        parent.window['layui-layer-iframe'+ index].submitForm();
                    }
                });
            });
            });
        </script>

    }

